<template>
	<view class="complainInfo">
		<uv-navbar title="投诉建议" @leftClick="goBack" bgColor="#277CC0" :placeholder="true"
			titleStyle="color:#FFFFFF;fontWeight:500" leftIconColor="#FFFFFF"></uv-navbar>
		<view class="personalBox">
			<uv-form labelPosition="left" :model="personaModel" :rules="personalRules" ref="form">
				<uv-form-item label="类型"  borderBottom  labelWidth="120rpx">
						<uv-radio-group v-model="personaModel.type">
							<uv-radio 
								:customStyle="{margin: '8px'}" 
								v-for="(item, index) in radiolist" 
								:key="index" 
								:label="item" 
								:name="item">
							</uv-radio>
							
						</uv-radio-group>
				
				</uv-form-item>
				<uv-form-item label="标题"  borderBottom  labelWidth="120rpx">
					<uv-input v-model="personaModel.title"  border="none" placeholder="请输入投诉建议的标题" >
					</uv-input>
				</uv-form-item>
				<uv-form-item label="投诉和建议"  borderBottom  labelWidth="160rpx" labelPosition="top">
					<view class="" style="padding-top: 14rpx;">
						<uv-textarea v-model="personaModel.content"  placeholder="请填写你的建议和意见，感谢您的支持~" ></uv-textarea> 
					</view>
				</uv-form-item>
				<uv-form-item label="联系方式"  borderBottom  labelWidth="140rpx">
					<uv-input v-model="personaModel.phone"  border="none" placeholder="请填写您的联系方式，尽快帮您解决问题~">
					</uv-input>
				</uv-form-item>
			</uv-form>
		</view>
		<view class="saveBox">
			<view class="save_btn" @click="submit">
				提交
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				personaModel: {
					type: "建议",
					title:"",
					content:"",
					phone:null,
				},
				radiolist:['建议','投诉'],
				personalRules: {}
			};
		},
		
		methods: {
			goBack() {
				uni.navigateBack({
					delta: 1
				})
			},
			async submit(){
				if(!this.$utils.checkStr(this.personaModel.phone ,'mobile')) return uni.showToast({
				    title:'请输入正确的联系方式',
				    icon:'none'
				})
				let result = await this.$api.addFeedback(this.personaModel)
				if(result.code==1){
					this.$utils.msg('提交成功')
					setTimeout(()=>{
							uni.navigateBack()
					},800)
				}else{
					this.$utils.msg(result.msg)
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
	.complainInfo {
		min-height: 100vh;
		background-color: RGBA(245, 245, 245, 1);
        position: relative;
		.personalBox {
			padding: 0rpx 19rpx;
		}
		.saveBox{
			width: 750rpx;
			height: 118rpx;
			position: fixed;
			bottom: 0rpx;
			left: 0rpx;
			background-color: #FFFFFF;
			display: flex;
			justify-content: center;
			align-items: center;
			.save_btn{
				width: 710rpx;
				height: 80rpx;
				background: #277CC0;
				border-radius: 8rpx;
				font-size: 32rpx;
				color: #FFFFFF;
				text-align: center;
				line-height: 80rpx;
			}
		}
	}
</style>